<template>
  <div class="home">
	<div>
		<div>
			<div>
				<van-row>
					<van-col span="1">
						<div >
							<img src="../assets/logo1.png" />
						</div>
						
					</van-col>
					<van-col span="22">
						<div>
							<h4 left-icon="weapp-nav">    -    </h4>
							
						</div>
						<div style="margin-top: 15px;">
							<van-search
							  v-model="value"
							  shape="round"
							  background="#4fc08d"
							  show-action
							  scan
							  placeholder="请输入搜索关键词"
							  @search="onSearch"
							>
							  <template #action>
							    <div @click="onSearch">搜索</div>
								
							  </template>
							</van-search>
							<van-divider />
							<div style="margin-top: 0.0625rem;border:1.2px solid #F0F8FF">
								<van-grid :column-num="3" >
									<van-grid-item icon="comment-o" to="/" text="急速问诊" />
									<van-grid-item icon="friends" to="/" text="找专家" />
									<van-grid-item icon="bulb-o" to="/" text="复诊开药" />
									</van-grid>
							</div>
							<van-divider />
						</div>
						<div style="margin-top:0.0625rem;border:1.2px solid #F0F8FF">
							<van-notice-bar
							  left-icon="volume-o"
							  text="欢迎来到医鹿,这里有专业的医生团队24小时为您服务。"
							/>
						</div>
						<div style="margin-top: 0.0625rem;border:1.2px solid #F0F8FF">
						<van-grid :column-num="5">
						  <van-grid-item icon="photo-o" to="/" text="免费问诊" />
						  <van-grid-item icon="photo-o" to="/adult" text="成人疫苗" />
						  <van-grid-item icon="photo-o" to="/" text="儿童疫苗" />
						  <van-grid-item icon="photo-o" to="/guahao" text="挂号就医" />
						  <van-grid-item icon="photo-o" to="/" text="预约体检" />
						  <van-grid-item icon="photo-o" to="/MedicalCare_Home" text="医护上门" />
						  <van-grid-item icon="photo-o" to="/" text="用药助手" />
						  <van-grid-item icon="http://xphdata.oss-cn-beijing.aliyuncs.com/116f452bd61e443eb46c51bbe4919ec3_%E5%84%BF%E7%A7%91.png?Expires=1666791472&OSSAccessKeyId=LTAI5t8QA19CRR2V15oHyHW8&Signature=S6jaMwdCU6NHRuURMpdz2etNiOI%3D" to="/child" text="儿科中心" />
						  <van-grid-item icon="shopping-cart-o" to="/main" text="自营药房" />
						  <van-grid-item icon="photo-o" to="/" text="皮肤中心" />
						</van-grid>
						</div>
						<van-divider />
						<div>
							<van-swipe style="height: 100px;" vertical>
							  <van-swipe-item>
								  <div class="dong">
								  <img src="../assets/in/image.png"/>
								  </div>
							  </van-swipe-item>
							  <van-swipe-item>
								  <div class="dong">
								  <img src="../assets/in/image.png"/>
								  </div>
								  </van-swipe-item>
							  <van-swipe-item>
								  <div class="dong">
								  <img src="../assets/in/image.png"/>
								  </div>
							  </van-swipe-item>
							  <van-swipe-item>
								  <div class="dong">
								  <img src="../assets/in/image.png"/>
								  </div>
							  </van-swipe-item>
							</van-swipe>
						</div>
						
						<van-skeleton title avatar :row="3" :loading="loading">
						  <div>
							<div style="text-align: left;font-size: 1.2rem;font-weight: bolder;">
								  <h6> 疫苗助手</h6>
							</div>
							  
							<div>
								<h3></h3>
								<van-grid :column-num="4">
								<van-grid-item icon="photo-o" to="/" text="需求登记" />
								<van-grid-item icon="photo-o" to="/" text="疫苗百科" />
								<van-grid-item icon="photo-o" to="/" text="疫苗预约" />
								<van-grid-item icon="photo-o" to="/" text="妈妈课堂" />
								</van-grid>
							</div>
						  </div>
						  
						</van-skeleton>
						<van-divider />
						<div>
							
						</div>
			
					</van-col>
					<van-col span="1"></van-col>
					</van-row>
			</div>
			
		</div>
	</div>
    
  </div>
</template>

<script>

import { ref } from 'vue';
import { onMounted } from 'vue';
export default {
  setup() {
    const value = ref('');
	const loading = ref(true);
	    onMounted(() => {
	      loading.value = false;
	    });
    return { 
		value,
		loading,
	 };
  },
};
</script>

<style>
	.dong{
		width: 100%;
		height: 100px;
	}
</style>